<template>
	<view class="container">
		<uni-section title="新闻动态" type="line">
			<uni-card padding="0" spacing="0"  v-for="(item,index) of dataAry" :key='index'>
				<template v-slot:cover>
					<view class="custom-cover">
						<image class="cover-image" mode="aspectFill"
							:src="item.src">
						</image>
						<view class="cover-content">
							<text class="uni-subtitle uni-white">来源{{index+1}}部</text>
						</view>
					</view>
				</template>
				<uni-list>
					<uni-list-item :title="item.title" showArrow></uni-list-item>
					<uni-list-item :title="item.abstract" showArrow></uni-list-item>
				</uni-list>
				<view slot="actions" class="card-actions no-border">
					<view class="card-actions-item" @click="actionsClick('分享')">
						<uni-icons type="pengyouquan" size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">分享</text>
					</view>
					<view class="card-actions-item" @click="actionsClick('点赞')">
						<uni-icons type="heart" size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">点赞</text>
					</view>
					<view class="card-actions-item" @click="actionsClick('评论')">
						<uni-icons type="chatbubble" size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">评论</text>
					</view>
				</view>
			</uni-card>
		</uni-section>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				dataAry:[
					{
						src:'https://www.dadi-cpa.com/u/cms/www/202505/19180529fb8d.png',
						title:'青岛理工大学“大地慈善”奖助学金颁发仪式圆满举行',
						abstract:'【摘要】2025年5月14日，青岛理工大学商学院礼堂内气氛热烈，掌声不断，“大地慈善”奖助学金颁发仪式在此隆重举行。'
					},
					{
						src:'https://www.dadi-cpa.com/u/cms/www/202505/07221616lk6e.png',
						title:'集团首席合伙人（轮值）于洋入选北京市可持续领域高端会计人才',
						abstract:'【摘要】集团首席合伙人（轮值）于洋入选北京市可持续领域高端会计人才。'
					},
					{
						src:'https://www.dadi-cpa.com/u/cms/www/202503/21145111hjux.png',
						title:'大地（集团）事务所2024年度表彰大会暨2025年度春季工作会议圆满召开',
						abstract:'【摘要】2025年3月16日，大地（集团）事务所2024年度表彰大会暨2025年度春季工作会议在京召开。'
					},
					{
						src:'https://www.dadi-cpa.com/u/cms/www/202504/27211906mxvs.png',
						title:'山东财经大学与大地集团签约“大地慈善”奖助学金捐赠协议暨校企合作签约仪式圆满举行',
						abstract:'【摘要】山东财经大学与大地集团签约“大地慈善”奖助学金捐赠协议暨校企合作签约仪式圆满举行。'
					}
				],
				
			}
		},
		methods: {
			actionsClick(text) {
				uni.showToast({
					title: text,
					icon: 'none'
				})
			}
		}
	}
</script>

<style lang="scss">
	.container {
		overflow: hidden;
	}

	.custom-cover {
		flex: 1;
		flex-direction: row;
		position: relative;
	}

	.cover-content {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 40px;
		background-color: rgba($color: #000000, $alpha: 0.4);
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-left: 15px;
		font-size: 14px;
		color: #fff;
	}

	.card-actions {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		height: 45px;
		border-top: 1px #eee solid;
	}

	.card-actions-item {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.card-actions-item-text {
		font-size: 12px;
		color: #666;
		margin-left: 5px;
	}

	.cover-image {
		flex: 1;
		height: 150px;
		width: 100%;
	}

	.no-border {
		border-width: 0;
	}
</style>